

<!DOCTYPE html>
<html lang class="loading">
<head><meta name="generator" content="Hexo 3.9.0">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>hexo添加live2d看板娘和不蒜子访问统计 - 闲看花开 静待花落</title>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="google" content="notranslate">
    <meta name="keywords" content="贰货不二,"> 
    <meta name="description" content="  利用hexo和GitHub搭建属于自己的私人博客（特详细） 个人博客美化–主题 hexo素锦主题开启Gitalk评论功能 hexo写博客时的一些东西
一、添加lived看板娘  live2d看板,"> 
    <meta name="author" content="贰货不二"> 
    <link rel="alternative" href="atom.xml" title="闲看花开 静待花落" type="application/atom+xml"> 
    <link rel="icon" href="/img/favicon.png"> 
    <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
    <link rel="stylesheet" href="/css/diaspora.css">
    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <script>
         (adsbygoogle = window.adsbygoogle || []).push({
              google_ad_client: "ca-pub-8691406134231910",
              enable_page_level_ads: true
         });
    </script>
    <script async custom-element="amp-auto-ads" src="https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js">
    </script>
    
</head>
</html>
<body class="loading">
    <span id="config-title" style="display:none">闲看花开 静待花落</span>
    <div id="loader"></div>
    <div id="single">
    <script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<div id="top" style="display: block;">
    <div class="bar" style="width: 0;"></div>
    <a class="icon-home image-icon" href="javascript:;" data-url="https://mrdcg.github.io"></a>
    <div title="播放/暂停" class="icon-play"></div>
    <h3 class="subtitle">hexo添加live2d看板娘和不蒜子访问统计</h3>
    <div class="social">
        <!--<div class="like-icon">-->
            <!--<a href="javascript:;" class="likeThis active"><span class="icon-like"></span><span class="count">76</span></a>-->
        <!--</div>-->
        <div>
            <div class="share">
                <a title="获取二维码" class="icon-scan" href="javascript:;"></a>
            </div>
            <div id="qr"></div>
        </div>
    </div>
    <div class="scrollbar"></div>
</div>

    <div class="section">
        <div class="article">
    <div class='main'>
        <h1 class="title">hexo添加live2d看板娘和不蒜子访问统计</h1>
        <div class="stuff">
            <span>七月 10, 2019</span>

            <span>
   阅读数(请刷新)<span id="busuanzi_value_page_pv"></span>
</span>
            
  <ul class="post-tags-list"><li class="post-tags-list-item"><a class="post-tags-list-link" href="/tags/互联网/">互联网</a></li></ul>



        </div>
        <div class="content markdown">
            <p>  <a href="https://mrdcg.github.io/2019/07/08/%E5%88%A9%E7%94%A8hexo%E5%92%8CGitHub%E6%90%AD%E5%BB%BA%E5%B1%9E%E4%BA%8E%E8%87%AA%E5%B7%B1%E7%9A%84%E7%A7%81%E4%BA%BA%E5%8D%9A%E5%AE%A2%EF%BC%88%E7%89%B9%E8%AF%A6%E7%BB%86%EF%BC%89/">利用hexo和GitHub搭建属于自己的私人博客（特详细）</a><br> <a href="https://mrdcg.github.io/2019/07/08/%E4%B8%AA%E4%BA%BA%E5%8D%9A%E5%AE%A2%E7%BE%8E%E5%8C%96--%E4%B8%BB%E9%A2%98/">个人博客美化–主题</a><br> <a href="https://mrdcg.github.io/2019/07/08/hexo%E7%B4%A0%E9%94%A6%E4%B8%BB%E9%A2%98%E5%BC%80%E5%90%AFGitalk%E8%AF%84%E8%AE%BA%E5%8A%9F%E8%83%BD/">hexo素锦主题开启Gitalk评论功能</a><br> <a href="https://mrdcg.github.io/2019/07/08/hexo%E5%86%99%E5%8D%9A%E5%AE%A2%E6%97%B6%E7%9A%84%E4%B8%80%E4%BA%9B%E4%B8%9C%E8%A5%BF/">hexo写博客时的一些东西</a></p>
<h2 id="一、添加lived看板娘"><a href="#一、添加lived看板娘" class="headerlink" title="一、添加lived看板娘"></a><a href></a>一、添加lived看板娘</h2><p> <img src="https://i.loli.net/2019/07/10/5d254b5c6417c65903.png" alt><br> <a href="https://huaji8.top/post/live2d-plugin-2.0/" target="_blank" rel="noopener">live2d看板娘模型展示</a></p>
<h3 id="1、安装live2d"><a href="#1、安装live2d" class="headerlink" title="1、安装live2d"></a><a href></a>1、安装live2d</h3><p> 命令行输入：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install --save hexo-helper-live2d</span><br></pre></td></tr></table></figure>

<p> <a href="https://github.com/xiazeyu/live2d-widget-models" target="_blank" rel="noopener">live2d文档</a>中有live2d所有模型列表</p>
<p> 安装想要的模型，如：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install live2d-widget-model-koharu</span><br></pre></td></tr></table></figure>

<p> 在hexo创建live2d_models文件夹，并在node_modules文件下找见刚安装下载的live2d-widget-model-koharu模型，将其放入live2d_models文件夹。</p>
<h3 id="模型配置"><a href="#模型配置" class="headerlink" title="模型配置"></a><a href></a>模型配置</h3><p> 之后在hexo的_config.yml或者theme的_config.yml中添加如下代码：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br></pre></td><td class="code"><pre><span class="line"># Live2D</span><br><span class="line">## https://github.com/EYHN/hexo-helper-live2d</span><br><span class="line">## https://l2dwidget.js.org/docs/class/src/index.js~L2Dwidget.html#instance-method-init</span><br><span class="line">live2d:</span><br><span class="line">  enable: true</span><br><span class="line">  #enable: false</span><br><span class="line">  scriptFrom: local # 默认</span><br><span class="line">  pluginRootPath: live2dw/ # 插件在站点上的根目录(相对路径)</span><br><span class="line">  pluginJsPath: lib/ # 脚本文件相对与插件根目录路径</span><br><span class="line">  pluginModelPath: assets/ # 模型文件相对与插件根目录路径</span><br><span class="line">  # scriptFrom: jsdelivr # jsdelivr CDN</span><br><span class="line">  # scriptFrom: unpkg # unpkg CDN</span><br><span class="line">  # scriptFrom: https://cdn.jsdelivr.net/npm/live2d-widget@3.x/lib/L2Dwidget.min.js # 你的自定义 url</span><br><span class="line">  tagMode: false # 标签模式, 是否仅替换 live2d tag标签而非插入到所有页面中</span><br><span class="line">  debug: false # 调试, 是否在控制台输出日志</span><br><span class="line">  model:</span><br><span class="line">    use: live2d-widget-model-koharu</span><br><span class="line">    # use: live2d-widget-model-wanko # npm-module package name</span><br><span class="line">    # use: wanko # 博客根目录/live2d_models/ 下的目录名</span><br><span class="line">    # use: ./wives/wanko # 相对于博客根目录的路径</span><br><span class="line">    # use: https://cdn.jsdelivr.net/npm/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json # 你的自定义 url</span><br><span class="line">  display:</span><br><span class="line">    position: right</span><br><span class="line">    width: 145</span><br><span class="line">    height: 315</span><br><span class="line">  mobile:</span><br><span class="line">    show: true # 是否在移动设备上显示</span><br><span class="line">    scale: 0.5 # 移动设备上的缩放       </span><br><span class="line">  react:</span><br><span class="line">    opacityDefault: 0.7</span><br><span class="line">    opacityOnHover: 0.8</span><br></pre></td></tr></table></figure>

<p> 将代码中的</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">model:</span><br><span class="line">   use: live2d-widget-model-koharu</span><br></pre></td></tr></table></figure>

<p> 模型名称换为你安装的模型，否则将为默认模型</p>
<h2 id="二、添加不蒜子访问统计"><a href="#二、添加不蒜子访问统计" class="headerlink" title="二、添加不蒜子访问统计"></a><a href></a>二、添加不蒜子访问统计</h2><p> 以我自己的主题为例<br> 在\themes\diaspora\layout_partial下找见menu.ejs文件（其他主题大多为footer文件，后缀名可能是swig等等），用编辑器打开<br> 添加：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;script async src=&quot;//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js&quot;&gt;&lt;/script&gt;</span><br></pre></td></tr></table></figure>


<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">&lt;span&gt;访问总量&lt;span id=&quot;busuanzi_value_site_pv&quot;&gt;&lt;/span&gt;次&lt;/span&gt;</span><br><span class="line">    &lt;span class=&quot;post-meta-divider&quot;&gt;|&lt;/span&gt;</span><br><span class="line">    &lt;span&gt;总访客&lt;span id=&quot;busuanzi_value_site_uv&quot;&gt;&lt;/span&gt;人&lt;/span&gt;</span><br><span class="line">    &lt;span class=&quot;post-meta-divider&quot;&gt;|&lt;/span&gt;</span><br></pre></td></tr></table></figure>

<p> 如图：<img src="https://i.loli.net/2019/07/10/5d254b5f6aabe47275.png" alt><br> 完成后，在\themes\diaspora\layout_partial\post下找见article.ejs文件<br> 添加：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"> &lt;span&gt;</span><br><span class="line">   阅读数&lt;span id=&quot;busuanzi_value_page_pv&quot;&gt;&lt;/span&gt;</span><br><span class="line">&lt;/span&gt;</span><br></pre></td></tr></table></figure>

<p> <img src="https://i.loli.net/2019/07/10/5d254b622e61386677.png" alt><br> 效果：<br> <img src="https://i.loli.net/2019/07/10/5d254b6589ac088994.png" alt><br> <img src="https://i.loli.net/2019/07/10/5d254b6988c4631791.png" alt></p>

            <!--[if lt IE 9]><script>document.createElement('audio');</script><![endif]-->
            <audio id="audio" loop="1" preload="auto" controls="controls" data-autoplay="false">
                <source type="audio/mpeg" src="http://link.hhtjim.com/163/1313052387.mp3">
            </audio>
            
        </div>
        
        
    <div id='gitalk-container' class="comment link"
        data-ae='false'
        data-ci='e79d3ae9c45da13e6f66'
        data-cs='896cb16e937a9e56f91295c1bab9e5aad59746ad'
        data-r='MrDCG.github.io'
        data-o='MrDCG'
        data-a='MrDCG'
        data-d='true'
    >查看评论</div>


        
    </div>

    
    
</div>

    </div>
</div>

<script src="/live2dw/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({"pluginRootPath":"live2dw/","pluginJsPath":"lib/","pluginModelPath":"assets/","tagMode":false,"debug":false,"model":{"jsonPath":"/live2dw/assets/assets/koharu.model.json"},"display":{"position":"right","width":145,"height":315},"mobile":{"show":true,"scale":0.5},"react":{"opacityDefault":0.7,"opacityOnHover":0.8},"log":false});</script></body>
<script src="//cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
<script src="//lib.baomitu.com/jquery/1.8.3/jquery.min.js"></script>
<script src="/js/plugin.js"></script>
<script src="/js/diaspora.js"></script>
<link rel="stylesheet" href="/photoswipe/photoswipe.css">
<link rel="stylesheet" href="/photoswipe/default-skin/default-skin.css">
<script src="/photoswipe/photoswipe.min.js"></script>
<script src="/photoswipe/photoswipe-ui-default.min.js"></script>

<!-- Root element of PhotoSwipe. Must have class pswp. -->
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
    <!-- Background of PhotoSwipe. 
         It's a separate element as animating opacity is faster than rgba(). -->
    <div class="pswp__bg"></div>
    <!-- Slides wrapper with overflow:hidden. -->
    <div class="pswp__scroll-wrap">
        <!-- Container that holds slides. 
            PhotoSwipe keeps only 3 of them in the DOM to save memory.
            Don't modify these 3 pswp__item elements, data is added later on. -->
        <div class="pswp__container">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>
        <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
        <div class="pswp__ui pswp__ui--hidden">
            <div class="pswp__top-bar">
                <!--  Controls are self-explanatory. Order can be changed. -->
                <div class="pswp__counter"></div>
                <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
                <button class="pswp__button pswp__button--share" title="Share"></button>
                <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
                <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
                <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                <!-- element will get class pswp__preloader--active when preloader is running -->
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                      <div class="pswp__preloader__cut">
                        <div class="pswp__preloader__donut"></div>
                      </div>
                    </div>
                </div>
            </div>
            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div> 
            </div>
            <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
            </button>
            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
            </button>
            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>
        </div>
    </div>
</div>




</html>
<!--崩溃欺骗-->
<script type="text/javascript" src="/js/crash_cheat.js"></script>
<!-- 页面点击小红心 -->
<script type="text/javascript" src="/js/clicklove.js"></script>